<template>
    <div>
        <van-nav-bar title="修改密码" left-text="返回"  left-arrow @click-left="proxy.$leftClick()"/>
        <van-form @submit="onSubmit">
            <van-cell-group inset>
                <van-field v-model="oldpassword" name="旧密码" label="旧密码" placeholder="oldpassword"
                    :rules="[{ required: true, message: '请填写旧密码' }]" />
                <van-field v-model="newpassword1" type="password" name="新密码" label="新密码" placeholder="newpassword"
                    :rules="[{ required: true, message: '请填写新密码' }]" />
                <van-field v-model="newpassword" type="password" name="再次输入新密码" label="再次输入新密码" placeholder="newpassword"
                :rules="[{validator, message: '两次新密码不一致' }]" />
            </van-cell-group>
            <div style="margin: 16px;">
                <van-button round block type="primary" native-type="submit">
                    提交
                </van-button>
            </div>
        </van-form>
    </div>
</template>

<script setup lang="ts">
import { ref ,getCurrentInstance,onBeforeMount} from 'vue';
import { useRouter } from 'vue-router';
import {changePass} from '../api/user'
import { showDialog } from 'vant';
const router = useRouter();
let oldpassword = ref('');
let newpassword1 = ref('');
let newpassword = ref('')
const {proxy}:any = getCurrentInstance();

const validator = ()=>{
    if(newpassword1.value.length>0){
        if(newpassword1.value == newpassword.value){
            return true;
        }
    }
    return false
}

onBeforeMount(()=>{
    if(!localStorage.getItem('token')){
        router.push({name:'denglu'})
    }
})
const onSubmit = async()=>{
    await changePass( localStorage.getItem('userId')as string,oldpassword.value,newpassword1.value);
    showDialog({
        message:"密码修改成功"
    })
    
}
</script>